<template>
	<view>
		<view class="example">
			<!-- 基础用法，不包含校验规则 -->
			<uni-forms ref="valiForm"  :rules="rules" :modelValue="timeTableData" labelWidth="60px" class="formClass"  >
				<uni-forms-item label="日期" class="formItem">
						<uni-easyinput v-model="selectDate"   disabled="true"  />
			 
				</uni-forms-item>
				<uni-forms-item label="时间"  class="formItem">
						<uni-easyinput v-model="time"   disabled="true"   />
				</uni-forms-item>
				<uni-forms-item label="课程"   name="course"  class="formItem">
					<uni-data-select  v-model="timeTableData.course" :localdata="termData.courseList"    >
					</uni-data-select>
				</uni-forms-item>
				<uni-forms-item label="教室"    name="classRoom"  class="formItem">
					<uni-easyinput   v-model="timeTableData.classRoom" placeholder="请输入教室"   />
				</uni-forms-item>
				<uni-forms-item label="备注"  class="formItem">
					<uni-easyinput type="textarea" autoHeight  v-model="timeTableData.memo" placeholder="请输入备注"  />
				</uni-forms-item>				
			</uni-forms>
			<view class="uni-btn-v btnClass"  >
				<button type="primary" class="btn" @tap="doSaveTimeTable('valiForm')"  >保 存</button>
				<button type="default" class="btn" @tap="doDelete"  v-if="deleteAble" >删 除</button>
				<button type="default" class="btn" @tap="goCtable"   >返 回</button>
			</view>	
		</view>
	</view>
</template>

<script>
	function formatFullDate(date) {
		let year = date.getFullYear();
		let month = date.getMonth() + 1;
		let day = date.getDate();
	 
		month = month > 9 ? month : '0' + month;;
		day = day > 9 ? day : '0' + day;
	
		return `${year}-${month}-${day}`;
	}
	export default {
		data() {
			return {
				deleteAble:false,
				termData:{courseList:[]},
				termIndex:0,
				timeTableData:{"course":null,"classRoom":null,"memo":null},
				selectDate:null,
				time:null,
				timeArr:["8:00","9:00","10:10","11:10","14:30","15:30","16:40","17:40","19:20","20:20"],
				oneDayTimeTableData:{tm:0,data:[{},{},{},{},{},{},{},{},{},{}]},
				timeIndex:0,
				dayIndex:0,
				startTimestamp:null,
				// 校验规则
				rules: {
					course: {
						rules: [{
							required: true,
							errorMessage: '课程不能为空'
						}]
					},
					classRoom: {
						rules: [{
							required: true,
							errorMessage: '教室不能为空'
						}]
					}
				},
			}
		},
		onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
		    this.loadTermStorage();
			
			console.log(option.dayIndex); //打印出上个页面传递的参数。
			console.log(option.timeIndex); //打印出上个页面传递的参数。
			console.log(option.startTimestamp); //打印出上个页面传递的参数。
			this.timeIndex=parseInt(option.timeIndex);
			this.dayIndex=parseInt(option.dayIndex);
			this.startTimestamp=parseInt(option.startTimestamp);
			let date = new Date(this.startTimestamp+this.dayIndex*(1000 * 60 * 60 * 24));
			console.log(this.startTimestamp+this.dayIndex*(1000 * 60 * 60 * 24));
			let dateStr = formatFullDate(date)
			this.selectDate = dateStr;
			this.time = this.timeArr[this.timeIndex]
            this.oneDayTimeTableData.tm=this.startTimestamp+this.dayIndex*(1000 * 60 * 60 * 24);
			
			let key ="timeTable:"+dateStr;
			uni.getStorage({
				key: key,
				success: (res) => {
					console.log("res.data", res.data);
					if (res.data.tm){
						this.oneDayTimeTableData= res.data;
						this.timeTableData=this.oneDayTimeTableData.data[this.timeIndex];
						
						if ((this.timeTableData.course==null|| this.timeTableData.course=="")
						&& (this.timeTableData.classRoom==null||this.timeTableData.classRoom=="") 
						&& (this.timeTableData.memo==null || this.timeTableData.memo=="")){
							this.deleteAble=false;
						}else{
							this.deleteAble=true;
						}	
					}
				},
				fail: () => {
					 
				}
			})
			
		},
		methods: {
			doDelete(){
				this.oneDayTimeTableData.data[this.timeIndex]={"course":null,"classRoom":null,"memo":null};
				let key ="timeTable:"+this.selectDate;
				uni.setStorage({
					key: key,
					data: this.oneDayTimeTableData,
					success: (res) => {
						// console.log(1111111111);
						// uni.showModal({
						// 	title: '存储数据成功',
						// 	showCancel:false
						// });
						this.goCtable();
					},
					fail: () => {
						console.log(22222222222);
						uni.showModal({
							title: '储存数据失败!',
							showCancel:false
						})
					}
				})
				this.goCtable();
			},
			doSaveTimeTable(ref){
				console.log("this.timeTableData",this.timeTableData);
				if ((this.timeTableData.course==null|| this.timeTableData.course=="") 
				&& (this.timeTableData.classRoom==null||this.timeTableData.classRoom=="") 
				&& (this.timeTableData.memo==null || this.timeTableData.memo=="")){
					uni.showModal({
						title: '请输入相关信息',
						showCancel:false
					})
					return;
				}
				if ((this.timeTableData.course==null || this.timeTableData.course=="")  && (this.timeTableData.classRoom!=null  && this.timeTableData.classRoom!="")){
					uni.showModal({
						title: '请选择课程',
						showCancel:false
					})
					return;
				}
				if ((this.timeTableData.course!=null && this.timeTableData.course!="")  && (this.timeTableData.classRoom==null||this.timeTableData.classRoom=="")){
					uni.showModal({
						title: '请输入教室',
						showCancel:false
					})
					return;
				}						
				//this.$refs[ref].validate().then(res => {
					this.oneDayTimeTableData.data[this.timeIndex]=this.timeTableData;
					this.oneDayTimeTableData.tm=this.startTimestamp+this.dayIndex*(1000 * 60 * 60 * 24);
					let key ="timeTable:"+this.selectDate;
					
					console.log("key",key);
					console.log("oneDayTimeTableData",this.oneDayTimeTableData);
					uni.setStorage({
						key: key,
						data: this.oneDayTimeTableData,
						success: (res) => {
							// console.log(1111111111);
							// uni.showModal({
							// 	title: '存储数据成功',
							// 	showCancel:false
							// });
							this.goCtable();
						},
						fail: () => {
							console.log(22222222222);
							uni.showModal({
								title: '储存数据失败!',
								showCancel:false
							})
						}
					})
				//})
			},
			goCtable(){
				uni.navigateTo({
				  url: '../ctable/ctable?startTimestamp=' +this.startTimestamp // 跳转到对应路径的页面
				});
			},
			loadTermStorage: function () {
				let key ="termIndex";				
				uni.getStorage({
					key: key,
					success: (res) => {
						this.termIndex= res.data;
						console.log("this.termIndex",this.termIndex);
						this.loadTermData();
					},
					fail: () => {
						this.termIndex=0;
					}
				})
				 
			},
			loadTermData: function () {
				let key ="termData"+this.termIndex;
				uni.getStorage({
					key: key,
					success: (res) => {
						console.log(res.data)
						this.termData= res.data;	
						if ( res.data.courseList==null){
							this.termData.courseList=[];
						}
						console.log(this.termData.courseList)
				    },
				})	
			}	
		}
	}
</script>

<style>
	.example {
 
		padding-right: 0rpx; 
		background-color: #fff;
		width: 100%;
	}
	.formItem{
		padding-left: 15rpx;
		padding-right: 15rpx;
	}
	.formClass{
		padding-top: 30rpx;
		padding-bottom: 30rpx;
	}
    .btnClass{
		padding-left: 15rpx;
		padding-right: 15rpx;
	}
</style>
